<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="/struts-tags" prefix="s"%>
<script type="text/javascript" charset="utf-8" src="js/jquery.listnav.min-2.1.js"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.dataTables.listnav.js"></script>
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		var trTable = $('#food-table').dataTable(
		{
			"sDom" : 'Zrtp',
			"sPaginationType" : "bootstrap",
			"iDisplayLength" : 15,
			"bServerSide" : true,
			"bPaginate" : true,
			"sAjaxSource" : "productTableAjax.action",
			"aoSearchCols": [
 				null,
 				null,
 				null,
 				{"sSearch": "Yes"}
 			],
			"aoColumnDefs" : [ {
				"fnRender" : function(o, val) {
					if (o.aData[3] == "Yes") {
						return '<a href=editTrustRegion.action?trustRegionId=' + o.aData[4] + '>' + o.aData[0] + '</a>';													
					} else {
						return '<a href="#" onClick=toActive(' + o.aData[4] + ')>' + o.aData[0] + '</a>';
					}
				},
				"aTargets" : [0]
			} ]
		});		
		
		//Toogle Form and Table
		$("#create-content").hide();
		$("#show-form").click(function() {
			$('#food').hide();
			$("#create-content").show();
		});

		$("#hide-form").click(function() {
			$("#create-content").hide();
			$('#food').show();
		});

		$("#create-content").css('backgroundColor', '#F3F3F3');
		
		$('#check-active').click(function() {
			var other = $('#check-active:checked').val();
			if (other != undefined) {
				trTable.fnFilter("", 3, true, false);
			} else {
				trTable.fnFilter("Yes", 3, true, false);
			}
		});	
		
		var save = getURLParameter('save');
		if (save == "successful") {							
			$.jGrowl("<h4 class='alert-heading'>Save Successfully</h4>", {theme : 'save-notification'});
		}
	});
	
	function toActive(id) {
		var r = confirm('Do you want to make this Trust Region active?');
		if (r == true) {
			window.location.replace("activeTrustRegion.action?trustRegionId=" + id);
		}
	}
	
	function getURLParameter(name) {
	    return decodeURI(
	        (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
	    );
	}
</script>
<s:if test="#session.logged != 'true'">
	<jsp:forward page="../index.jsp" />
</s:if>
<div class="container-fluid">
	<div class="content">
		<div class="row-fluid">
			<div class="span12">
				<div class="box">
					<div class="box-head">
						<h3>Product List</h3>
					</div>
					<div id="food" class="box-content">
						<form action="#" class='form-horizontal' method="post">
							<div class="control-group">
								<div id="search-box">
									<div class="row-fluid force-margin">
										<div class="span3">
											<label for="basic" class="control-label">First Name:</label>
											<div class="controls">
												<input type="text" name="firstname" id="basic"
													class='input-square'>
											</div>
										</div>
										<div class="span3">
											<label for="basic" class="control-label">Surname:</label>
											<div class="controls">
												<input type="text" name="surname" id="basic"
													class='input-square'>
											</div>
										</div>
										<div>
											<a href="#" class="btn btn-success" style="margin-left: 70px ; margin-top: 10px;">Search</a>
										</div>	
									</div>
								</div>
							</div>
							
							<div class="control-group">
								<div id="inactive-div">
									<a id="show-form" class="btn btn-success">Create</a>
									<!-- <label class="checkbox"><input type="checkbox"
										name="check-inactive" id="check-active"> Include
										In-active</label> -->
								</div>
								<table id="food-table"
									class="table table-striped table-bordered">
									<thead>
										<tr>
											<th>Trust Region Name</th>
											<th>Description</th>
											<th>Nation/Country</th>
											<th>Is Active?</th>
										</tr>
									</thead>
									<tbody>
									</tbody>
								</table>
							</div>
						</form>
					</div>
					
					
					<div class="box-content" id="create-content">
						<form action="addLesson.action" class='validate form-horizontal'
							method="post">
							<div class="row-fluid force-margin">
								<div class="span3">
									<div class="control-group">
										<label for="lessonName" class="control-label">Lesson Name</label>
										<div class="controls">
											<input type="text" name="lesson.name" id="lessonName" class='span12 input-square'>
										</div>
									</div>
									
									<div class="control-group">
										<label class="control-label" for="lessonOpenDate">Open Date</label>
										<div class="controls">
											<!-- <input type="text" name="lesson.openDate" id="lessonOpenDate" class='datepick required'> -->
											<s:date name="lesson.openDate" format="dd-MM-yyyy" />
										</div>
									</div>
									
									<div class="control-group">
										<label class="control-label" for="lessonCloseDate">Close Date</label>
										<div class="controls">
											<!-- <input type="text" name="lesson.closeDate" id="lessonCloseDate" class='datepick required'> -->
											<s:date name="lesson.closeDate" format="dd-MM-yyyy" />
										</div>
									</div>
									
									<div class="control-group">
										<label for="lessonPrice" class="control-label">Price</label>
										<div class="controls">
											<input type="text" name="lesson.price" id="lessonPrice">
										</div>
									</div>
									
									<div class="control-group">
										<label for="lessonTrainer" class="control-label">Trainer</label>
										<div class="controls">
											<select id="select" name="lesson.trainner">
												<option value="Steve Job">Steve Job</option>
												<option value="Rooney">Rooney</option>
											</select>
										</div>
									</div>
									<div class="control-group">
										<label class="control-label" for="isClosed">Close Lesson</label>
										<div class="controls">
											<label class="checkbox"><input type="checkbox" id="isClosed" name="lesson.isClosed"> </label>
										</div>
									</div>
								</div>
								
								<div class="row-fluid">
									<div class="span12">
										<div class="form-actions">
											<button class="btn btn-primary" type="submit">Save</button>
											<a id="hide-form" class='btn btn-danger'>Close</a>
										</div>
									</div>
								</div>
								
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>